{include file="/sum/common/script" /}
<style>
    .store-store-form .sa-template-wrap {
        width: 100%;
        max-width: unset;
    }

    .store-store-form .sa-template-wrap .item {
        align-items: flex-start;
    }

    .store-store-form .sa-template-wrap .el-form-item .el-form-item__content {
        margin-left: 0 !important;
    }

    .store-store-form .sa-template-wrap .express {
        flex: unset !important;
        width: 110px;
    }
    .aftersale-content {
        padding: var(--sa-padding) var(--sa-padding) 0;
        background: var(--sa-background-hex-hover);
        border-radius: 8px;
        margin-bottom: 16px;
    }
    .order-type {
        width: 200px;
        height: 80px;
        border: 1px solid rgb(230, 230, 230);
        border-radius: 4px;
        margin-left: 16px;
        cursor: pointer;
    }

    .order-type.is-active {
        border: 1px solid var(--el-color-primary);
    }

</style>
<div id="addEdit" class="store-store-form" v-cloak>
    <el-container class="panel-block">
        <el-main>
            <el-scrollbar height="100%">



                <el-form :model="form.model" :rules="form.rules" ref="formRef" label-width="100px">
                    <div class="sa-flex mb-4">
                        <img class="order-type" :class="form.model.type=='normal'?'is-active':''"
                             src="/assets/addons/sum/img/stock_order/normal.jpg"
                             @click="onChangeOrderType('normal')" />
                        <img class="order-type" :class="form.model.type=='gift'?'is-active':''"
                             src="/assets/addons/sum/img/stock_order/gift.png"
                             @click="onChangeOrderType('gift')" />
                    </div>
                    <div class="refund-content aftersale-content sa-m-b-26">
                        <div class="title sa-m-b-16">商品信息</div>
                        <el-row :gutter="10">
                            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                                <div class="goods-item sa-flex sa-col-top">
                                    <sa-image class="mr-2" :url="form.model.goods.image" size="64"></sa-image>
                                    <div>
                                        <div class="goods-title sa-table-line-1">
                                            {{form.model.goods.title}}
                                        </div>
                                        <div class="goods-price">
                                            ¥ {{ form.model.goods.price?.join('~') || 0 }}
                                        </div>
                                        <div class="goods-sku-text">
                                            进货价: {{form.model.goods.stock_price}}
                                        </div>
                                    </div>
                                </div>
                            </el-col>
                        </el-row>
                    </div>

                    <el-form-item label="进货数量" prop="goods_num">
                        <el-input class="sa-w-360" v-model="form.model.goods_num" placeholder="请输入进货数量" type="number" :min="0"></el-input>
                    </el-form-item>

                    <el-form-item label="收货人" prop="consignee">
                        <el-input class="sa-w-360" v-model="form.model.consignee" placeholder="请输入收货人"></el-input>
                    </el-form-item>
                    <el-form-item label="收货手机号" prop="mobile">
                        <el-input class="sa-w-360" v-model="form.model.mobile" placeholder="请输入收货手机号"></el-input>
                    </el-form-item>

                    <el-form-item label="收货地址" prop="pcd">
                        <el-cascader ref="addressRef" v-model="form.model.pcd" :options="area.select" :props="{ label: 'name', value: 'id' }">
                        </el-cascader>
                    </el-form-item>
                    <el-form-item label="详细地址" prop="address">
                        <el-input class="sa-w-360" placeholder="请输入详细地址信息" v-model="form.model.address"></el-input>
                    </el-form-item>


                </el-form>
            </el-scrollbar>
        </el-main>
        <el-footer class="sa-footer--submit sa-flex sa-row-right">
            <span style="margin-right: 20px">总价格：{{order_amount}}</span>
            <el-button type="primary" @click="onConfirm">确定</el-button>
        </el-footer>
    </el-container>
</div>